<template>
    <div class="my-wbox my-statistics">
        <el-tabs v-model="activeName">
            <el-tab-pane :label="item.name" v-for="(item, index) in tabData" :name="item.id">
                <MySearch v-if="activeName == item.id" :searchData="searchData" @listenClick="listenClick">
                    <template #townId>
                        <div class="lh32">
                            <el-select v-model="townId" placeholder="请选择乡镇" clearable size="large" :disabled="loading || userInfo.roleId == '4' || userInfo.roleId == '5'
            " @change="onSlotSearch('townId')">
                                <el-option :label="v.name" :value="v.areaCode || ''" v-for="v in townIdArr"
                                    :index="v.areaCode" />
                            </el-select>
                        </div>
                    </template>

                </MySearch>
                <MyTable v-if="activeName == item.id" :tableData="tableData" @listenClick="listenClick">
                    <template #default="{ slotData, slotColumn }">
                        <div v-if="slotColumn.prop === 'resourceType'">
                            {{ ['有奖举报', '用户举报'][slotData.resourceType - 1] }}
                        </div>
                        <div v-if="slotColumn.prop === 'approveFlag'">
                            {{ ['-', '审批中'][slotData.approveFlag] }}
                        </div>
                        <div v-if="slotColumn.prop === 'delayFlag'">
                            <div class="print" :class="slotData.delayFlag ? 'redPrint' : ''"></div>
                        </div>
                        <div v-if="slotColumn.prop === 'orderStatus'">
                            {{ renderNum(slotData.orderStatus) }}
                        </div>

                    </template>

                </MyTable>
            </el-tab-pane>
        </el-tabs>

        <!-- 分配窗口 -->
        <RecordFollow :isShowDialog="isShowDialog" :dialogData="dialogData"></RecordFollow>
        <!-- 市级 再次分配 -->
        <Again :isShowDialog="isShowAGDialog" :dialogData="dialogData"></Again>

        <!-- 驳回窗口 -->
        <Stop :isShowDialog="isShowBDialog" :dialogData="dialogData"></Stop>

        <!-- 回访窗口 -->
        <FollowUp :isShowDialog="isShowFDialog" :dialogData="dialogData">
        </FollowUp>

        <!-- 不予立案窗口 -->
        <Nolian :isShowDialog="isShowNDialog" :dialogData="dialogData">
        </Nolian>

        <!-- 退回窗口 -->
        <Back :isShowDialog="isShowKDialog" :dialogData="dialogData"></Back>

        <!-- 镇级 隐患分配  -->
        <Follow2Up v-if="(activeName == 2) && acceptId" :isShowDialog="isShow2Dialog" :dialogData="dialogData"
            :roleId="userInfo.roleId" :acceptId="acceptId">
        </Follow2Up>

        <!-- 镇级 再次分配  -->
        <Follow3Up v-if="(activeName == 2) && acceptId" :isShowDialog="isShow3Dialog" :dialogData="dialogData"
            :roleId="userInfo.roleId" :acceptId="acceptId">
        </Follow3Up>

        <!-- 有奖举报录入  -->
        <Awarded :isShowDialog="isShowAwDialog" />
        <!-- 延期申请窗口 -->
        <Delay :isShowDialog="isShowDeDialog" :dialogData="dialogData"></Delay>
        <!-- 收回  -->
        <Recover :isShowDialog="isShowRDialog" :dialogData="dialogData"></Recover>

        <!-- 话费奖励 isShowRGDialog -->
        <Reward :isShowDialog="isShowRGDialog" :dialogData="dialogData"></Reward>
    </div>
</template>
<script setup lang='ts'>
// @ts-ignore
import { ref, reactive, watch, computed } from 'vue'
import { useRouter } from 'vue-router'
import { FunTime } from '@/global/methods'
import http from '@/http/http'
import { ParentSearch, ParentTable } from '@/interface/index'
import { useStore } from '@/store'
import { SelectObj } from '@/interface/index'
import RecordFollow from './components/RecordFollow.vue'
import Bohui from './components/Bohui.vue'
import Back from './components/Back.vue'
import Stop from './components/Stop.vue'
import FollowUp from './components/FollowUp.vue'
import Nolian from './components/Nolian.vue'
import Follow2Up from './components/Follow2Up.vue'
import Follow3Up from './components/Follow3Up.vue'
import Delay from './components/Delay.vue'
import Awarded from './components/Awarded.vue'
import Again from './components/Again.vue'
import Recover from './components/Recover.vue'
import Reward from './components/Reward.vue'

import {
    getUserInfo,
    setSearchFamily,
    getSearchFamily,
    removeSearchFamily,
} from '@/global/session'
import { ElMessage } from 'element-plus'
import { getNewAreaListApi } from '@/views/account/api/accountApi'
import { DangerSearch } from '@/views/extra/interface/interface'

let searchInfo = getSearchFamily()//搜索条件

//监听加载
const loading = computed(() => {
    return store.getters['loading/getLoad']
})
const router = useRouter()
const store = useStore()
const activeName = ref<number | string>(1)//选项卡变化

import { ColumnTable } from '@/interface/index'
import { Right } from '@element-plus/icons-vue'

let tabData = ref<any[]>([])//选项卡
const searchData = reactive<ParentSearch>({
    searchForm: [
        {
            key: 'orderCode',
            styleType: 'input',
            label: '工单编号:',
            labelShow: true,
            value: '',
            placeholder: '可输入工单编号搜索',
            inputWidth: '200px',
        },
        {
            key: 'unitName',
            styleType: 'input',
            label: '举报单位名称:',
            labelShow: true,
            value: '',
            placeholder: '可输入举报单位名称搜索',
            inputWidth: '200px',
        },
        {
            key: 'reportUser',
            styleType: 'input',
            label: '举报人姓名:',
            labelShow: true,
            value: '',
            placeholder: '可输入举报人姓名搜索',
            inputWidth: '200px',
        },
        {
            key: 'date',
            styleType: 'date',
            type: 'daterange',
            startPlaceholder: '开始时间',
            endPlaceholder: '结束时间',
            label: '时间范围:',
            labelShow: true,
            value: '',
            format: 'YYYY-MM-DD',
            valueFormat: 'YYYY-MM-DD',
        },
        {
            key: 'townId',
            styleType: 'slot',
            label: '乡镇:',
            labelShow: true,
            value: '',
            hide(row: any): boolean {
                return userInfo.roleId == '1' || ((userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '1')
            },
        },
        {
            key: 'orderStatus',
            styleType: 'select',
            label: '工单状态',
            labelShow: true,
            value: '',
            placeholder: '请选择',
            data: [
                { label: '全部', value: '' },
                { label: '待签收', value: 1 },
                { label: '已签收（未派发）', value: 2 },
                { label: '已派发', value: 3 },
                { label: '已退回', value: 6 },
                { label: '不予立案', value: 7 },
            ],
            hide(row: any): boolean {
                return (userInfo.roleId == '4' || userInfo.roleId == '6')
            },
        },
    ],
    searchBtn: [
        {
            name: 'onAwarded',
            type: 'primary',
            text: '有奖举报录入',
            hide(row: any): boolean {
                return (userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '1'
            },
        },
        {
            name: 'onExportAll', type: 'primary', text: '导出', hide(row: any): boolean {
                return (userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '2'
            },
        },
    ],
})
//封装的表格
const tableData = reactive<ParentTable>({
    //表格的一些数据
    listApi: '/manage/admin/reportRectify/pcPageHandle', //列表搜索接口
    listHttp: 'post', //列表接口方法
    search: {}, //搜索条件
    column: [
    ],
    columnBtn: {
        //操作按钮
        label: '操作',
        align: 'center',
        fixed: 'right',
        width: '400',
        btn: [
            // 所有
            { name: 'onDetail', text: '详情', },
            // 市级
            { name: 'onFollowRecord', text: '立案', hide: (row: any) => (userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '1' },
            { name: 'onNotCase', text: '不予立案', hide: (row: any) => (userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '1' },

            { name: 'onRecover', text: '收回', hide: (row: any) => (userInfo.roleId == '2' || userInfo.roleId == '3') && row.orderStatus == '1' && activeName.value == '2' },

            { name: 'onAglign', text: '再次分配', hide: (row: any) => (userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '3' },
            { name: 'onReward', text: '话费奖励', hide: (row: any) => (userInfo.roleId == '2' || userInfo.roleId == '3') && row.rewardFlag != '1' && activeName.value == '4' },
            // {
            //     name: 'myApi',
            //     text: '驳回',
            //     api: '/manage/admin/reportRectify/reject',
            //     http: 'put',
            //     confirm: true,
            //     confirmText: 'acceptCode',
            //     refresh: true,
            //     params: { id: '' },
            //     hide: (row: any) => (userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '3'
            // },
            { name: 'onStop', text: '终止', hide: (row: any) => (userInfo.roleId == '2' || userInfo.roleId == '3') && activeName.value == '3' },
            // 镇级
            {
                name: 'myApi',
                text: '签收',
                api: '/manage/admin/reportRectify/sign',
                http: 'put',
                confirm: true,
                confirmText: 'acceptCode',
                refresh: true,
                params: { id: '' },

                hide: (row: any) => (userInfo.roleId == '4' || userInfo.roleId == '6') && row.delayFlag != 1 && row.approveFlag == 0 && activeName.value == '1'
            },
            { name: 'onNotCase', text: '不予立案', hide: (row: any) => (userInfo.roleId == '4' || userInfo.roleId == '6') && row.delayFlag != 1 && row.approveFlag == 0 && activeName.value == '1' },

            { name: 'onBack', text: '退回', hide: (row: any) => (userInfo.roleId == '4' || userInfo.roleId == '6') && row.delayFlag != 1 && row.approveFlag == 0 && activeName.value == '1' },
            { name: 'onFollow2', text: '派单', hide: (row: any) => (userInfo.roleId == '4' || userInfo.roleId == '6') && row.delayFlag != 1 && row.orderStatus == '2' && activeName.value == '2' },
            { name: 'onFollow3', text: '再次分配', hide: (row: any) => (userInfo.roleId == '4' || userInfo.roleId == '6') && row.delayFlag != 1 && row.orderStatus == '6' && activeName.value == '2' },

            // {
            //     name: 'myApi',
            //     text: '驳回',
            //     api: '/manage/admin/reportRectify/reject',
            //     http: 'put',
            //     confirm: true,
            //     confirmText: 'acceptCode',
            //     refresh: true,
            //     params: { id: '' },
            //     hide: (row: any) => (userInfo.roleId == '4' || userInfo.roleId == '6') && row.delayFlag != 1 && row.orderStatus == '6' && activeName.value == '2'
            // },
            { name: 'onDelay', text: '延期申请', hide: (row: any) => (userInfo.roleId == '4' || userInfo.roleId == '6') && row.delayFlag == 1 && row.delayApproveFlag == 0 },


            // { name: 'onFollowUp', text: '记录回访', hide: (row: any) => userInfo.roleId == '4' && row.rectifyStatus == 3 && row.visitFlag == 0 },
        ],
    }, //表按钮
    index: true, //true 显示序号
    selection: false,
})

const time = FunTime('', 'YY-MM-DD-Zh')
let title = ref<string>('')
watch(
    () => activeName.value,
    () => {
        onPreview()//预览
    }
)

let userInfo = reactive({ roleId: '', townId: '', countryId: '', roleAuth: '', townName: '', countryName: '' })
userInfo = JSON.parse(getUserInfo() as string)
const townId = ref<string>('')//乡镇
const countryId = ref<string>('')//村组

//预览数据
const onPreview = () => {
    searchData.searchForm[0].value = ''
    searchData.searchForm[1].value = ''
    searchData.searchForm[2].value = ''
    searchData.searchForm[3].value = ''
    searchData.searchForm[4].value = ''
    searchData.searchForm[5].value = ''
    townId.value = ''

    if (userInfo.roleId == '2' || userInfo.roleId == '3') {
        // 1、待派发，2、已派发，3、已办理，4、已退回，5、不予立案
        tabData.value = [
            {
                name: `待派发`,
                id: 1
            },
            {
                name: `已派发`,
                id: 2
            },
            {
                name: `再次派发`,
                id: 3
            },
            {
                name: `话费核实`,
                id: 4
            },

        ]

        if (activeName.value == '1') {
            tableData.column = [
                //表头
                { prop: 'acceptCode', label: '工单编号', width: '180', align: 'left' },
                { prop: 'resourceType', label: '数据来源', width: '120', align: 'left', slot: true },
                { prop: 'unitName', label: '被举报单位名称', align: 'left', width: '280', tooltip: true },
                { prop: 'address', label: '举报问题地址', width: '200', align: 'left' },
                { prop: 'reportUser', label: '举报人姓名', width: '120', align: 'left' },
                { prop: 'userTel', label: '举报人电话', width: '150', align: 'left' },
                { prop: 'createTime', label: '举报提交时间', width: '180', align: 'left' },
            ]
            tableData.search = {
                reportStatus: 1
            }
            tableData.selection = false

        } else if (activeName.value == '2') {
            tableData.column = [
                //表头
                { prop: 'acceptCode', label: '工单编号', width: '180', align: 'left' },
                { prop: 'orderCode', label: '子工单编号', width: '180', align: 'left' },
                { prop: 'resourceType', label: '数据来源', width: '120', slot: true },
                { prop: 'unitName', label: '被举报单位名称', align: 'left', width: '280', tooltip: true },
                { prop: 'address', label: '举报问题地址', width: '200', tooltip: true, align: 'left' },
                { prop: 'reportUser', label: '举报人姓名', width: '120', align: 'left' },
                { prop: 'userTel', label: '举报人电话', width: '150', align: 'left' },
                { prop: 'acceptName', label: '接收单位名称', width: '150', align: 'left' },
                { prop: 'createTime', label: '举报提交时间', width: '180', align: 'left' },
            ]
            tableData.search = {
                reportStatus: 2
            }
            tableData.selection = false
        } else if (activeName.value == '3') {
            tableData.column = [
                //表头
                { prop: 'acceptCode', label: '工单编号', width: '180', align: 'left' },
                { prop: 'orderCode', label: '子工单编号', width: '180', align: 'left' },
                { prop: 'resourceType', label: '数据来源', width: '120', slot: true },
                { prop: 'unitName', label: '被举报单位名称', align: 'left', width: '280', tooltip: true },
                { prop: 'address', label: '举报问题地址', width: '200', tooltip: true, align: 'left' },
                { prop: 'reportUser', label: '举报人姓名', width: '120', align: 'left' },
                { prop: 'userTel', label: '举报人电话', width: '150', align: 'left' },
                { prop: 'acceptName', label: '接收单位名称', width: '150', align: 'left' },
                { prop: 'createTime', label: '举报提交时间', width: '180', align: 'left' },
            ]
            tableData.search = {
                reportStatus: 3
            }
            tableData.selection = false

        } else if (activeName.value == '4') {
            tableData.column = [
                //表头
                { prop: 'acceptCode', label: '工单编号', width: '180', align: 'left' },
                { prop: 'orderCode', label: '子工单编号', width: '180', align: 'left' },
                { prop: 'resourceType', label: '数据来源', width: '120', slot: true },
                { prop: 'unitName', label: '被举报单位名称', align: 'left', width: '280', tooltip: true },
                { prop: 'address', label: '举报问题地址', width: '200', tooltip: true, align: 'left' },
                { prop: 'reportUser', label: '举报人姓名', width: '120', align: 'left' },
                { prop: 'userTel', label: '举报人电话', width: '150', align: 'left' },
                { prop: 'acceptName', label: '接收单位名称', width: '150', align: 'left' },
                { prop: 'createTime', label: '举报提交时间', width: '180', align: 'left' },
            ]
            tableData.search = {
                reportStatus: 4
            }
            tableData.selection = false

        }
    } else if (userInfo.roleId == '4' || userInfo.roleId == '6') {
        // 1、待签收，2、已签收(未派发),3、已派发，4、已办理，5、已延期，6、已退回，7、不予立案
        //镇级管理员 (三级单位  4 6 )
        tabData.value = [
            {
                name: `待签收`,
                id: 1
            },
            {
                name: `待办理（未派发）`,
                id: 2
            },
            {
                name: `待办理（已派发）`,
                id: 3
            },
        ]

        tableData.column = [
            //表头
            { prop: 'acceptCode', label: '工单编号', width: '180', align: 'left' },
            { prop: 'orderCode', label: '子工单编号', width: '180', align: 'left' },
            { prop: 'resourceType', label: '数据来源', width: '120', slot: true },
            { prop: 'unitName', label: '被举报单位名称', align: 'left', width: '280', tooltip: true },
            { prop: 'address', label: '举报问题地址', width: '200', tooltip: true, align: 'left' },
            { prop: 'reportUser', label: '举报人姓名', width: '120', align: 'left' },
            { prop: 'userTel', label: '举报人电话', width: '150', align: 'left' },
            { prop: 'cityDispatchTime', label: '派单时间', width: '180', align: 'left' },
            { prop: 'requireTime', label: '规定完成时间', width: '180', align: 'left' },
            { prop: 'delayFlag', label: '延期标识', width: '100', align: 'center', slot: true },
            { prop: 'orderStatus', label: '工单状态', width: '100', align: 'center', slot: true },
        ]

        if (activeName.value == '1') {
            tableData.search = {
                reportStatusTown: 1
            }
            tableData.selection = false

        } else if (activeName.value == '2') {

            tableData.search = {
                reportStatusTown: 2
            }
            tableData.selection = false

        } else if (activeName.value == '3') {

            tableData.search = {
                reportStatusTown: 3
            }
            tableData.selection = false

        }
    }

}


onPreview()//预览

//插槽的搜索  keySlot传入对应的key
const onSlotSearch = (keySlot: string) => {
    let obj = searchData.searchForm?.find((t) => t.key === keySlot)
    if (obj) {
        if (keySlot === 'townId') {
            obj.value = townId.value
        }
        // isSearch.value = !isSearch.value //是否触发搜索
    }
}
//列表搜索
const onSearch = (val: any) => {
    if (userInfo.roleId == '4' || userInfo.roleId == '6') {
        val.reportStatusTown = activeName.value
    } else {
        val.reportStatus = activeName.value

    }
    if (val.date) {
        val.startTime = val.date[0]
        val.endTime = val.date[1]
    }
    tableData.search = val
    //刷新表格
    store.commit('refresh/setRefresh', !store.getters['refresh/getRefresh'])
    //yaohui
    //把搜索条件记录一下
    setSearchFamily(JSON.stringify(tableData.search))
}
//列表搜索重置 清空插槽里面的内容
const onSearchClear = (val: any) => {
    townId.value = ''
    removeSearchFamily() //清除搜索条件
    onSearch(val)
}
// 有奖举报录入
const onAwarded = () => {
    isShowAwDialog.value = !isShowAwDialog.value
}

//详情
const onDetail = (row: any) => {
    //yaohui
    //把搜索条件记录一下
    setSearchFamily(JSON.stringify(tableData.search))
    router.push({
        name: 'dangerDetail',
        query: { id: row.id, reportStatus: activeName.value, approveFlag: row.approveFlag },
    })
}
// 隐患分配
const onFollowRecord = (row: any) => {
    if (row) {
        dialogData.value = row.id
        isShowDialog.value = !isShowDialog.value
    } else {
        if (selection.value.length == 0) {
            ElMessage({ type: 'warning', message: '请选择需要分配的隐患' })
        } else {
            let idArr: any = []
            selection.value.map((item: any) => {
                idArr.push(item.id)
            })
            dialogData.value = idArr
            isShowDialog.value = !isShowDialog.value

        }

    }
}
// 镇级隐患分配
const onFollow2 = (row: any) => {
    acceptId.value = row.acceptId
    dialogData.value = row.id
    setTimeout(() => {
        isShow2Dialog.value = !isShow2Dialog.value

    }, 500);

}
// 镇级再次隐患分配
const onFollow3 = (row: any) => {
    acceptId.value = row.acceptId
    dialogData.value = row.id
    setTimeout(() => {
        isShow3Dialog.value = !isShow3Dialog.value

    }, 500);

}

// 延期申请
const onDelay = (row: any) => {
    dialogData.value = row.id
    isShowDeDialog.value = !isShowDeDialog.value

}

// 不予立案
const onNotCase = (row: any) => {
    dialogData.value = row.id
    isShowNDialog.value = !isShowNDialog.value
}

// 收回
const onRecover = (row: any) => {
    dialogData.value = row.id
    isShowRDialog.value = !isShowRDialog.value
}
// 市级 再次分配
const onAglign = (row: any) => {
    dialogData.value = row.id
    isShowAGDialog.value = !isShowAGDialog.value
}
// 话费奖励
const onReward = (row: any) => {
    dialogData.value = row.id
    isShowRGDialog.value = !isShowRGDialog.value
}
// 退回
const onBack = (row: any) => {
    dialogData.value = row.id
    isShowKDialog.value = !isShowKDialog.value
}

//分页 一页多少条数
const onListenPageSize = (val: number) => {
    tableData.search.pageSize = val
}
//分页  当前页码
const onListenPageIndex = (val: number) => {
    tableData.search.currentPage = val
}

const isShowBDialog = ref<boolean>(false) //数据转移弹窗是否出现
const isShowDialog = ref<boolean>(false) //数据转移弹窗是否出现
const isShowAwDialog = ref<boolean>(false) //数据转移弹窗是否出现
const isShowNDialog = ref<boolean>(false) //不予立案弹窗是否出现 
const isShowRDialog = ref<boolean>(false) //不予立案弹窗是否出现 
const isShow2Dialog = ref<boolean>(false) //不予立案弹窗是否出现 
const isShow3Dialog = ref<boolean>(false) //不予立案弹窗是否出现 
const isShowDeDialog = ref<boolean>(false) //不予立案弹窗是否出现 
const isShowKDialog = ref<boolean>(false) //不予立案弹窗是否出现
const isShowFDialog = ref<boolean>(false) //数据转移弹窗是否出现 
const isShowAGDialog = ref<boolean>(false) //数据转移弹窗是否出现 
const isShowRGDialog = ref<boolean>(false) //数据转移弹窗是否出现 
const dialogData: any = ref([]) //传给弹窗的数据
const acceptId: any = ref('')
const selection: any = ref([])
//数据转移
const onTransfer = () => {
    if (selection.value.length == 0) {
        ElMessage({ type: 'warning', message: '请选择需要转移的户主' })
    } else {
        isShowDialog.value = !isShowDialog.value
        const arr = selection.value.map((item: any) => item.id)
        dialogData.value = arr
    }
}
const onSelectionChange = (val: any) => {
    selection.value = val
}

//驳回
const onStop = (row: any) => {
    dialogData.value = row.id
    isShowBDialog.value = !isShowBDialog.value


}
// 记录回访
const onFollowUp = (row: any) => {
    dialogData.value = row.id
    isShowFDialog.value = !isShowFDialog.value
}
//导出
const onExportAll = () => {
    store.commit('loading/setLoad', true)
    let params = tableData.search
    onFunApi('/manage/admin/reportRectify/export', params)
}
const onFunApi = async (url: string, params: any) => {
    try {
        let res = await http.post(url, params)
        if (res?.code === 0 && res.data) {
            window.open(res.data)
        }
        // store.commit('loading/setLoad', false)
    } finally {
        store.commit('loading/setLoad', false)
    }
}

//定义方法对象 注意定义的方法 必须在上面已经申明 所以建议objFun申明和 listenClick方法 写在页面最下面
const objFun = {
    onDetail: onDetail,
    onAwarded: onAwarded,
    onSearch: onSearch,
    onFollowRecord: onFollowRecord,
    onFollow2: onFollow2,
    onFollow3: onFollow3,
    onDelay: onDelay,
    onNotCase: onNotCase,
    onRecover: onRecover,
    onAglign: onAglign,
    onReward: onReward,
    onBack: onBack,
    onSearchClear: onSearchClear,
    onListenPageSize: onListenPageSize,
    onListenPageIndex: onListenPageIndex,
    onTransfer: onTransfer,
    onSelectionChange: onSelectionChange,
    onStop: onStop,
    onFollowUp: onFollowUp,
    onExportAll: onExportAll,
}
// 监听子级表格  传过来的方法禁用
const listenClick = (name: string, val: any) => {
    console.log(name)
    objFun[name](val)
}
const renderNum = (num) => {
    let string = ''
    switch (num) {
        case '1':
            string = '待签收'
            break;
        case '2':
            string = '已签收（未派发）'
            break;
        case '3':
            string = '已派发'
            break;
        case '6':
            string = '已退回'
            break;
        case '7':
            string = '不予立案'
            break;

        default:
            string = '-'
            break;
    }
    return string
}

//获取所有乡镇
let townIdArr = ref<SelectObj[]>([]) //乡镇
const onAreaList = async () => {
    try {
        let res = await getNewAreaListApi()
        if (res?.code === 0) {
            townIdArr.value = res.data
        }
    } catch { }
}
// yaohui

onAreaList()

//详情页返回的搜索条件保留
const searchTiaojian = () => {
    if (searchInfo) {
        let searchObj = JSON.parse(searchInfo)
        activeName.value = searchObj.reportStatusTown || searchObj.reportStatus


        setTimeout(() => {

            searchData.searchForm[0].value = searchObj.orderCode
            searchData.searchForm[1].value = searchObj.unitName
            searchData.searchForm[2].value = searchObj.reportUser
            searchData.searchForm[3].value = searchObj.date
            searchData.searchForm[4].value = searchObj.townId
            searchData.searchForm[5].value = searchObj.orderStatus
            townId.value = searchObj.townId

            onSearch(searchObj)
        }, 800);


    }
}
searchTiaojian()

</script>
<style scoped lang='scss'>
.my-statistics {
    position: relative;

    .print {
        width: 10px;
        height: 10px;
        background-color: green;
        border-radius: 50%;
    }

    .redPrint {
        background-color: red;
    }

    &__btn {
        position: absolute;
        right: 20px;
        top: 20px;
        z-index: 9999;
    }

    :deep(.el-tabs__item) {
        height: 60px;
        line-height: 40px;
        font-size: 15px;
    }

    :deep(.el-tabs__item.is-active) {
        font-weight: bold;
    }
}

.my-loading {
    width: 100%;
    height: calc(100vh - 200px);
}

.my-table {
    width: 100%;
    border: 1px solid #ebeef5;

    :deep(th.el-table__cell) {
        background: #f2f2f2;
        color: #111;
    }
}

.my-title01 {
    text-align: center;
    margin-bottom: 10px;
}
</style>